<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>房源头条</title>
    <meta content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0" name="viewport" />
    <meta content="yes" name="apple-mobile-web-app-capable" />
    <meta content="black" name="apple-mobile-web-app-status-bar-style" />
    <meta content="telephone=no" name="format-detection" />
    <!-- 引入YDUI样式 -->
    <link rel="stylesheet" href="../build/css/ydui.css" />
	<link rel="stylesheet" href="../css/common.css" />
	<link rel="stylesheet" href="../css/fontcss/css/font-awesome.min.css" />
    <!-- 引入YDUI自适应解决方案类库 -->
    
	<style>
		.item-list{
			padding: .3rem;
		}
		.item-list .left-img{
			position: relative;
			width: 3rem;
			height: 2rem;
			margin: 0 .2rem 0 0;
			float: left;
		}
		img{
			width: 100%;
			height: 100%;
		}
		.desc-right .desc-title{
			padding: 0 0 .1rem 0;
			font-size: .25rem;
		}
		.desc-right .desc-address{
			color:#5D5D5D ;
			padding: .1rem 0;
		}
		.desc-right .desc-content{
			color:#898989 ;
			display: inline-block;
		}
		.desc-right{
			padding: .3rem 0;
			overflow: hidden;
			text-overflow:ellipsis;
			white-space: nowrap;
		}
		.desc-right p{
			overflow: hidden;
			text-overflow: ellipsis;
			white-space: nowrap;
		}
		.status{
			position: absolute;
			top: 0;
			color: #fff;
			background: #C1060F;
			padding: .05rem .4rem .05rem .1rem;
			border-radius: 0 .2rem .2rem 0;
		}
	</style>
</head>
<body>
	<section class="g-flexview">
		<!-- 顶部内容 -->
		<header class="m-navbar">
			<a href="#" onClick="javascript :window.history.back(); return false;" class="navbar-item">
				<i class="back-ico"></i>
			</a>
			<div class="navbar-center">
				<span class="navbar-title">房源头条</span>
			</div>
		</header>
		<!-- 房源头条列表 -->
		<div class="g-scrollview" id="list_ontent"></div>
		<!-- 报备客户按钮 -->
		<a href="reportecustomers/index.html">
			<div id="preparation">报备</div>
		</a>
</section>
<!-- 引入jQuery 3.0+ -->
<script src="../js/jq331.min.js"></script>

<script src="../js/common.js"></script>
<script src="../build/js/ydui.flexible.js"></script>
<!-- 引入YDUI脚本 -->
<script src="../build/js/ydui.js"></script>
<!-- <script src="../js/Index.js"></script> -->
<script src="../js/template.js"></script>		
<script id="house_list" type="text/html">
	{{each data as value index}}
		<a href="
		{{if data[index].init_status=='新房'}}
		./contentdetails.html?id={{data[index].id}}
		{{else if data[index].init_status=='二手房'}}
		./olddetails.html?id={{data[index].id}}
		{{/if}}
		">
			<div class="item-list" data-id="{{data[index].id}}">
				<div class="left-img">
					<img src="{{data[index].cover_img.img_url}}" />
					<span class="status">{{data[index].init_status}}</span>
				</div>
				<div class="desc-right">
					<p class="desc-title">{{data[index].title}}</p>
					<p class="desc-address">{{data[index].house_address}}</p>
					<p class="desc-content">{{data[index].desc}}</p>
				</div>
			</div>
		</a>
	{{/each}}
</script>
<script>
	$(document).ready(function(){
		var nenwslistApi = commapi + 'house/head';//房源头条接口
// 		$('.item-list').click(function(){
// 			location.href="./contentdetails.html";
// 		});
		
		//获取房源头条列表
		$.ajax({
			url: nenwslistApi,
			type: 'GET',											
			success: function (ret) {	
				if(ret.length==0){
					$('#listContent').html("<img style='max-width: 100%;height: auto;' src='../static/images/nodata.png' />");
				}else{
					var html = template('house_list', {data: ret});
					$('#list_ontent').html(html);									
				}
			}
		});
	});
</script>


</body>
</html>